// @TODO: Remove this line and restore the import in `./gutenboard.tsx` when a release after @wordpress/components@8.5.0 is published.
// See https://github.com/WordPress/gutenberg/pull/19535
@import '~@wordpress/components/build-style/style';
@import 'assets/stylesheets/gutenberg-base-styles';

@font-face {
	font-display: swap;
	font-family: 'Recoleta';
	font-weight: 400;
	src: url( 'https://s1.wp.com/i/fonts/recoleta/400.eot' );
	src: url( 'https://s1.wp.com/i/fonts/recoleta/400.eot?#iefix' ) format( 'embedded-opentype' ),
		url( 'https://s1.wp.com/i/fonts/recoleta/400.woff2' ) format( 'woff2' ),
		url( 'https://s1.wp.com/i/fonts/recoleta/400.woff' ) format( 'woff' ),
		url( 'https://s1.wp.com/i/fonts/recoleta/400.ttf' ) format( 'truetype' );
}

// Override core variables: we don't have wp-admin header and sidebar in Calypso
// Targetting styles from `@wordpress/edit-post`
$admin-bar-height: 0;
$admin-bar-height-big: 0;
$admin-sidebar-width: 0;
$admin-sidebar-width-big: 0;
$admin-sidebar-width-collapsed: 0;

// Gutenberg styles
@import '~@wordpress/edit-post/src/style.scss';
@import '~@wordpress/block-editor/src/style.scss';
@import '~@wordpress/format-library/src/style.scss';

.gutenboard__edit-post-layout-content {
	position: static;
}

.wp-block {
	max-width: 1100px; // Overrides default $content-width
}

.components-button.is-link {
	text-decoration: none;
}

input:disabled {
	background: var( --color-neutral-0 );
	border-color: var( --color-neutral-0 );
	color: var( --color-neutral-20 );
	opacity: 1;
	-webkit-text-fill-color: var( --color-neutral-20 );

	&:hover {
		cursor: default;
	}

	&::placeholder {
		color: var( --color-neutral-20 );
	}
}